<template>
	<div class="right_bottom">
		<!-- <dv-capsule-chart :config="config" style="width:100%;height:260px" /> -->
		<dv-scroll-ranking-board :config="config" 
		style="width:100%;height:260px" />
	</div>
</template>

<script>
import {
		currentPOST
	} from 'api/modules'
	export default {
		data() {
			return {
				gatewayno: '',
				config: {
					showValue: true,
					unit: "%",
					data: []
				},

			};
		},
		created() {
			this.getData()
		},
		computed: {},
		mounted() {},
		beforeDestroy() {
			this.clearData()
		},
		methods: {
			clearData() {
				if (this.timer) {
					clearInterval(this.timer)
					this.timer = null
				}
			},
			//轮询
			switper() {
				if (this.timer) {
					return
				}
				let looper = (a) => {
					this.getData()
				};
				this.timer = setInterval(looper, this.$store.state.setting.echartsAutoTime);
			},
			getData() {
				this.pageflag = true
				currentPOST('/ipac-apic/bigScreen/companyCommentRank', {
					limit: 10
				}).then(res => {
					if (res.code == 200) {
						let temp = []
						for(let i=0; i<res.data.length; i++) {
							temp.push({
								name: res.data[i].name,
								value: res.data[i].star
							})
						}
						this.config = {
							...this.config,
							data: temp
						}
						this.switper()
					} else {
						this.pageflag = false
						this.$Message({
							text: res.msg,
							type: 'warning'
						})
					}
				})
			},
		},
	};
</script>
<style lang='scss' scoped>
	.list_Wrap {
		height: 100%;
		overflow: hidden;

		:deep(.kong) {
			width: auto;
		}
	}

	.sbtxSwiperclass {
		.img_wrap {
			overflow-x: auto;
		}

	}

	.right_bottom {
		box-sizing: border-box;
		padding: 0 16px;

		.searchform {
			height: 80px;
			display: flex;
			align-items: center;
			justify-content: center;

			.searchform_item {
				display: flex;
				justify-content: center;
				align-items: center;

				label {
					margin-right: 10px;
					color: rgba(255, 255, 255, 0.8);
				}

				button {
					margin-left: 30px;
				}

				input {}
			}
		}

		.img_wrap {
			display: flex;
			box-sizing: border-box;
			padding: 0 0 20px;
			li {
				width: 105px;
				height: 137px;
				border-radius: 6px;
				overflow: hidden;
				cursor: pointer;
				overflow: hidden;
				flex-shrink: 0;
				margin: 0 10px;

				img {
					flex-shrink: 0;
				}
			}
		}
		.noData {
			width: 100%;
			line-height: 100px;
			text-align: center;
			color: rgb(129, 128, 128);

		}
	}
</style>